<template>
    <div>
        <div  class="bottomshop">
            <div style="display: flex; justify-content: space-around; width: 70%">
              <div style="display: flex; flex-direction: column; align-items: center"
              @click="goindex"
              >
                <div>
                  <wd-icon name="home" size="22px"></wd-icon>
                </div>
                <div>首页</div>
              </div>
              <div style="display: flex; flex-direction: column; align-items: center"
              @click="goshopping"
              >
                <div>
                  <wd-icon name="cart" size="22px"></wd-icon>
                </div>
                <div >购物车</div>
              </div>
              <div style="display: flex; flex-direction: column; align-items: center">
                <div>总计 ￥{{ shopcarlist.reduce((pre,cur)=>parseFloat(pre+((cur.goodsid.price*cur.goodsid.discount)*cur.shopnum)).toFixed(2),0)}}</div>
                <div style="font-size: 25rpx;">为你节省 ￥{{ shopcarlist.reduce((pre,cur)=>parseFloat(pre+((cur.goodsid.price*(1-cur.goodsid.discount))*cur.shopnum)).toFixed(2),0)}}</div>
              </div>
            </div>
            <div style="width: 30%; align-items: right;margin-right: 10px">
                <wd-button type="error" size="medium" round>去下单({{shopcarlist.length  }})</wd-button>
            </div>
          </div>
    </div>
</template>

<script setup lang="ts">

import { ref } from 'vue'
import { useshopcar } from '@/store/shopcar.ts';//获取store
import {storeToRefs} from 'pinia'

const shopcar=useshopcar();
const {shopcarlist}=storeToRefs(shopcar);
// console.log(shopcarlist.value);

const goindex=()=>{
    // console.log('跳转');
    uni.switchTab({
        url:'/pages/IndexPages/index/index'
    })
}
const goshopping=()=>{
    // console.log('跳转');
    uni.switchTab({
        url:'/pages/ShoppingPages/shopping/shopping'
    })
}

</script>
/
<style scoped>
.bottomshop {
    width: 100%;
    margin: 0 auto;
    height: 100rpx;
    z-index: 9998;
    background-color: white;
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: 0px 0 5px rgb(121, 121, 121);
  }
</style>